import { reqCategory1List, reqCategory2List, reqCategory3List } from "@/api";
import Vue from "vue";
const state = {
    //一级分类列表
    category1List: [],
};
const mutations = {
    // 给一级分类category1List设置新值
    set_category1List(state, payload) {
        state.category1List = payload.category1List;
        // 给category1List中的每一个对象都添加children
        state.category1List.forEach((item) => {
            Vue.set(item, "children", [])
        })
    },

    // 给一级分类对应的id的对象，添加二级分类
    set_category2List(state, payload) {
        state.category1List[payload.nowCategoryIndex].children = payload.result
    },


};
const actions = {
    // 获取一级分类的的列表
    async getCategory1List({ commit }) {
        const result = await reqCategory1List();
        commit("set_category1List", { category1List: result });
    },


    // 获取二级分类的列表
    async getCategory2List(store, category1Id) {
        //如果想要在actions函数中拿到当前的模块的state数据有两种方式 1.this:指的是完成的store  2.参数store:指的是当前的store
        //先判断当前category1Id对应的一级分类属性上的children属性有没有值,如果有则说明已经获取过了,则不再发送请求,如果没有则发送请求
        const nowCategory = store.state.category1List.find(
            (item) => item.id === category1Id
        );

        // 获取当前category1Id所在的对象在category1List中所在的下标
        const nowCategoryIndex = store.state.category1List.findIndex(
            (item) => item.id === category1Id
        )
        // console.log(nowCategory);
        if (nowCategory.children.length !== 0) return;
        //如果当前一级分类没有children属性,则说明没有发过当前id的二级分类请求,则需要重新发送请求
        const result = await reqCategory2List(category1Id);

        // 正常接口是先请求一级之后，然后当需要某个一级的数据，就会把对应的二级和三级一个接口一个请求一起请求回来
        // 因为我们接口出现问题，所以现在只能先请求完二级，然后遍历请求对应的三级

        // 声明一个数组，保存所有三级请求的promise，方便未来并发控制
        const reqArr = [];

        // 遍历所有的二级列表，根据二级列表id发送三级列表请求，我们把发送请求得到的promise使用数组收集起来
        result.forEach((item) => {
            const category3Promise = reqCategory3List(item.id)
            reqArr.push(category3Promise)
        })

        //把收集所有当前二级中的三级列表的请求所在的数组,使用Promise.all进行并发处理
        // Promise.all返回promise实例，如果接收的参数中所有的promise都成功，则all方法返回的promise就成功，值为所有结果值组成的数组
        const category3Result = await Promise.all(reqArr)

        // console.log(category3Result);

        //遍历请求的结果,把每一个值插入到对应的二级列表中
        category3Result.forEach((item, index) => {
            result[index].children = item
        })


        // nowCategory.children = result;
        // 提交mutations进行数据修改
        store.commit('set_category2List', { nowCategoryIndex, result })
    },

};
const getters = {};

export default {
    namespaced: true,
    state,
    mutations,
    actions,
    getters,
};
